/**
 *  车辆管理 - 样式
 * @author xiaoxujs
 */

import styled from "styled-components";

export const ShippingReportBox = styled.div<{
    $height: number;
}>`
    padding:0  2rem;
    padding-right: 9rem;
    width: 100%;
    box-sizing: border-box;
    background-color: #FFFFFF;
    max-height: ${props => props.$height} + 'px';
    overflow-y: scroll;
    &::-webkit-scrollbar {
        display: none;
    }
    .title_box{
        height: 6rem;
        display: flex;
        align-items: center;
        .goback_box{
            font-family: Microsoft YaHei;
            font-weight: 400;
            font-size: 1.4rem;
            color: #8B9BAC;
             margin-right: 2rem;
            .iconfont {
                margin-right: 1rem;
            }
            cursor: pointer;
        }
        .title_text {
            font-family: Microsoft YaHei;
            font-weight: 400;
            font-size: 1.6rem;
            color: #3B3E4A;
        }
    }
    .add_search_box{
        height: 6.5rem;
        display: flex;
        justify-content: space-between;
        align-items: center;
        .title{
            font-family: PingFang SC;
            font-weight: 500;
            font-size: 1.6rem;
            color: #333333;
        }
    }
`

export const DetailsBox = styled.div`
    height: 4.5rem;
    background: #FFFFFF;
    border-top: .1rem solid #F3F3F3;
    border-bottom: .1rem solid #F3F3F3;
    display: flex;
    align-content: center;
    .details_item{
        display: flex;
        align-items: center;
        font-family: PingFang SC;
        font-weight: 500;
        font-size: 1.4rem;
        color: #A2AEBC;
        .details_item_title{
            padding-left: 2rem;
        }
        .details_item_text{
            padding-right: 2rem;
        }
    }
`

export const EChartsBox = styled.div`
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 2rem;
    .echarts_left_box{
        width: 44.9rem;
        height: 28.6rem;
        background: #FCFCFC;
        border-radius: .4rem;
        padding: 2rem;
        box-sizing: border-box;
        .echarts_title{
            font-family: PingFang SC;
            font-weight: 500;
            font-size: 1.6rem;
            color: #333333;
        }
        .echarts_neirong_box{
            height: 25rem;
            display: flex;
            align-items: center;
          
            .echarts_box_echarts_item{
                width: 18rem;
                height: 18rem;
                background: #F5F5F9;
                border-radius: 50%;
                margin-left: 3rem;
                /* padding: 1.5rem; */
                box-sizing: border-box;
                display: flex;
                align-items: center;
                justify-content: center;
                position: relative;
                .dingwei{
                    width: 18rem;
                    height: 18rem;
                    position: absolute;
                    top: 0;
                    left: 0;
                    display: flex;
                    align-items: center;
                    justify-content: center;
                    flex-direction: column;
                    .value{
                        font-family: PingFang SC;
                        font-weight: bold;
                        font-size: 1.9rem;
                        color: #333333;
                    }
                    .title{
                        font-family: PingFang SC;
                        font-weight: 500;
                        font-size: 1.1rem;
                        color: #333333;
                        margin-top:.8rem;
                    }
                }
            }
        }
        .tupianjieshi_box{
            margin-left: 3.6rem;
            display: flex;
            /* align-items: center; */
            justify-content: center;
            flex-direction: column;
            .tupianjieshi_item{
                display: flex;
                align-items: center;
                font-family: PingFang SC;
                font-weight: 500;
                font-size: 1.4rem;
                color: #333333;
                .dian{
                    width: 1rem;
                    height: 1rem;
                    background: #DFDFDF;
                    border-radius: 50%;
                    margin-right: 1.3rem;
                }
            }

        }
    }
    .echarts_right_box{
        width: 113.2rem;
        height: 28.6rem;
        background: #FCFCFC;
        border-radius: .4rem;
        padding: 2rem;
        box-sizing: border-box;
        .echarts_title{
            font-family: PingFang SC;
            font-weight: 500;
            font-size: 1.6rem;
            color: #333333;
        }
    }
`

export const ModuleSearchBox = styled.div`
    display: flex;
    justify-content: end;
    align-items: center;
    margin-bottom: 1rem;
    .huoyunzhuangtai{
        font-family: PingFang SC;
        font-weight: 500;
        font-size: 1.4rem;
        color: #333333;
        margin-right: 1rem;
    }
`